<!--
 * @Descripttion: 
 * @Author: voanit
 * @Date: 2022-05-11 14:32:39
 * @LastEditors: voanit
 * @LastEditTime: 2022-05-11 15:40:23
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="./redux.js"></script>
</head>

<body>
  <script>

    // let Redux = window.Redux
    // console.log(Redux);
    /* 1-获取 createStore */
    const { createStore } = window.Redux
    /* 2-创建 action===发布任务 发布者 */
    const action1 = {
      type: 'increment',
      payload: 5
    }
    const action2 = {
      type: 'add'
    }
    const action3 = {
      type: 'chen'
    }
    /* 3-执行任务  订阅者===纯函数 */
    // const reducer = (state = 10, action) => {
    //   console.log(action, 777);
    //   switch (action.type) {
    //     case 'add':
    //       // 返回新的state
    //       return state + 1
    //     case 'increment':
    //       // 返回新的state
    //       return state - action.payload
    //     default:
    //       return state
    //   }
    // }
    const reducer = (list = [1, 2, 3], action) => {
      console.log(action, 777);
      switch (action.type) {
        case 'add':
          // 返回新的state
          return [...list, 'add']
        case 'increment':
          // 返回新的state
          return [...list, 'bb']
        default:
          return list
      }
    }

    // 4-创建 store
    const store = createStore(reducer)
    /* 5-store获取状态 */
    // console.log(store.getState(), 9988);
    // console.log(store, 9988);
    // const unSubscribe = store.subscribe(() => {
    //   // 状态改变时，执行相应操作
    //   console.log('数据发生改变了');
    // })
    // store.dispatch(action2)
    // // 取消监听状态变化
    // // unSubscribe()
    // store.dispatch(action1)
    console.log(store.getState(), 9988);


  </script>
</body>

</html>